<template>
  <view class="entire">
    <view class="title">{{ cert.title }}</view>
    <image :src="cert.picture" class="picture" mode="aspectFill"></image>
  </view>
</template>

<script setup>
const props = defineProps({
  cert: { type: Object, required: true },
})
</script>
<style scoped lang="scss">
.entire {
  width: 700rpx;
  height: 350rpx;
  background-color: white;
  border-top-left-radius: 15rpx;
  border-top-right-radius: 15rpx;
  overflow: hidden;
  margin-left: 25rpx;
  margin-top: 30rpx;
  display: flex;
  flex-direction: column;
  .title {
    width: 700rpx;
    height: 50rpx;
    background-color: #254872;
    color: white;
    font-size: 25rpx;
    display: flex;
    align-items: center;
    padding-left: 20rpx;
  }
  .picture {
    width: 700rpx;
    height: 300rpx;
  }
}
</style>
